<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>比赛实况</title>
    <link rel="stylesheet" href="layui_src/css/layui.css"  media="all">
    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">
	<link rel="shortcut icon" href="img/ic.png">
    <!-- Custom CSS -->
    <link href="css/sb-admin.css" rel="stylesheet">

    <!-- Morris Charts CSS -->
    <link href="css/plugins/morris.css" rel="stylesheet">
    <link href="nuget/content/content/toastr.css" rel="stylesheet" type="text/css"/>
    <!-- Custom Fonts -->
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="css/cdn/font_evmq6xwfabutyb9.css"/>
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->

    <!--<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>-->
    <!--<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>-->
    <!--[if lt IE 9]>
    <script src="js/cdn/html5shiv-3.7.0.js"></script>
    <script src="js/cdn/respond-1.4.2.min.js"></script>
    <![endif]-->
    <!--<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/plug-ins/28e7751dbec/integration/bootstrap/3/dataTables.bootstrap.css"/>-->
    <!--<link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_i0327076nave7b9.css"/>-->
    <link rel="stylesheet" href="css/cdn/dataTables.bootstrap.css">
    <link rel="stylesheet" href="css/cdn/font_i0327076nave7b9.css">
    <link rel="stylesheet" type="text/css" href="css/datatable.css"/>
    <style>
        #allmap {
            height: 665px;
            overflow: hidden;
            margin: 0;
            font-family: "微软雅黑";
        }

        #example_paginate {
            float: right;
        }

        .handle-btn {
            cursor: pointer;
            margin: 0 2px;
        }

        #wrapper {
            padding-left: 0px;
        }

        .navigation {
            border-bottom: 3px solid #edebeb;
        }

        .navigation a:hover {
            color: #0F6AFC;
            border-bottom: 2px solid #01AAED;
        }

        .this {
            color: #01aaed;
            font-weight: bold;
            border-bottom: 2px solid #01AAED;
        }
        #realTime > thead {
            display: none;
        }
		#realTime >tbody tr{
			 line-height: 25px;
			margin: 2px 0 ;
		}
		#intervene > thead {
            display: none;
        }
		#intervene >tbody tr{
			 line-height: 25px;
			margin: 2px 0 ;
		}
        #Illegal > thead {
            display: none;
        }
        #Illegal >tbody tr{
			 line-height: 25px;
			margin: 2px 0 ;
		}
        #achievement > tbody tr {
            line-height: 28px;
            text-align: center;
            margin: 2px 0 ;
        }
        #achievement > tbody td {
            text-align: center;
        }
		.odd{
			background: #fff;
		}
        .div_modle {
            position: absolute;
            top: 70px;
            left: 40px;
            /*width: 260px;*/
            /*height: 180px;*/
            background: #fff;
            border-radius: 5px;

            padding: 0rem 1rem .5rem 1rem !important;
        }
        .div_modle .txt-right{
            text-align: right;
        }
        #allmap label{
        	border-radius: 3px;
        	color: #0AA788;
        	max-width:none;
        }

       
        @media screen and (max-width: 1200px) {
            /*padding: 0px 25px 0px 0px;height: 100%; width: 110%; overflow-x: hidden;overflow-y: scroll*/
            r-scroll {
                background-color: red !important;
                padding: 0px 50px 0px 0px !important;
                /*width: 106%;*/
                /*height: 100%;*/
            }
        }
        @media screen and (min-width: 1200px) {
            /*padding: 0px 25px 0px 0px;height: 100%; width: 110%; overflow-x: hidden;overflow-y: scroll*/
            r-scroll {
                padding: 0px 25px 0px 0px !important;
                /*width: 110%;*/
                /*height: 100%;*/
            }
        }
         .BMap_cpyCtrl,.BMap_noprint,.anchorBL{
        	display: none;
        }
    </style>
</head>

<body>


<div id="wrapper">

    <div id="page-wrapper">

        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <div class="col-lg-9 col-md-7" >
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <b class="panel-title"><span class="xiahua">实时跟踪</span></b>
                            </div>
                            <div class="panel-body">
                                <div id="allmap"></div>
                                <div class="div_modle alert  "v-show="labelShow" v-cloak>
                                    <button type="button" class="close" v-on:click="show()"><span aria-hidden="true">×</span></button>
                                    <div class="form-group">
                                        <label class="col-sm-12" style="color: #0AA788;">{{faultSupport.teamName}}</label>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-12">位置：</label>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-12" style="color: #0AA788;">{{faultSupport.position}}</label>
                                    </div>

                                    <div class="form-group">
                                        <label class="col-sm-12">定位时间：</label>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-12" style="color: #0AA788;">{{faultSupport.createTimeInfo}}</label>
                                    </div>
                                    <div class="form-group txt-right" v-if="faultSupport.teamState === 1">
                                        <button class="btn btn-primary" v-on:click="resolve(faultSupport);">处理</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-5">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <b class="panel-title"><span class="xiahua">实时成绩</span></b>
                                <span style="float: right;">
                                	<a href="achieve.html" style="color: #0AA788;">more  <i class="fa fa-arrow-circle-right"></i></a>
                                </span>
                            </div>
                            <div class="panel-body">
                                <div class="table" style="height: 265px;overflow: hidden;">
                                    <div class="r-scroll" style="height: 100%;width: 110%;overflow-x: hidden;overflow-y: scroll">
                                        <!--style="padding: 0px 25px 0px 0px;height: 100%; width: 110%; overflow-x: hidden;overflow-y: scroll"-->
                                        <table id="realTime" class="display" width="98%"></table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-5">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <b class="panel-title"><span class="xiahua">违规信息</span></b>
                                <span style="float: right;">
                                	<a href="Illegal.html" style="color: #0AA788;">more  <i class="fa fa-arrow-circle-right"></i></a>
                                </span>
                            </div>
                            <div class="panel-body">
                                <div class="table" style="height: 265px;overflow: hidden;">
                                    <div class="r-scroll" style="height: 100%;width: 110%;overflow-x: hidden;overflow-y: scroll">
                                        <!--style="padding: 0px 25px 0px 0px;height: 100%; width: 110%; overflow-x: hidden;overflow-y: scroll"-->
                                        <table id="Illegal" class="display" width="98%"></table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4" style="display: none;">
                    	<div class="panel panel-default">
                            <div class="panel-heading">
                                <b class="panel-title"><span class="xiahua">人工违规</span></b>
                                <span style="float: right;">
                                	<a href="intervene.html" target="_blank" style="color: #0AA788;">more  <i class="fa fa-arrow-circle-right"></i></a>
                                </span>
                            </div>
                            <div class="panel-body">
                                <div class="table" style="height: 255px;overflow: hidden;">
                                    <table id="intervene" class="display" width="100%"></table>
                                </div>
                            </div>
                        </div>
                    </div>
                   <!-- <div class="col-lg-12" >
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <b class="panel-title"><span class="xiahua">故障</span>支援</b>
                            </div>
                            <div class="panel-body" id="panel" id="faultSupportDetail">
                                <div id="allmap"></div>
                                <div class="div_modle" v-show="labelShow" v-cloak>
                                    <div class="form-group">
                                        <label class="col-sm-12">高速赛场</label>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-6">{{faultSupport.teamName}}</label>
                                        <label class="col-sm-6">{{faultSupport.refereeName}}</label>
                                    </div>
                                    <div class="form-group">
                                    	<label class="col-sm-12">{{faultSupport.faultDesc}}</label>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-5">位置：</label>
                                        <label class="col-sm-7">{{faultSupport.locationDesc}}</label>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-5">提交时间：</label>
                                        <label class="col-sm-7">{{faultSupport.createTimeInfo}}</label>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-6"><span style="color: red;">{{faultSupport.faultSupportStateInfo}}</span></label>
                                        <label class="col-sm-6">
                                            <button type="button" class="btn btn-primary"
                                                    v-on:click="changeState(faultSupport.faultSupportId)">
                                                提交更改
                                            </button>
                                        </label>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                    <div class="col-lg-3" style="display: none;">
                  		<div class="panel panel-default">
                            <div class="panel-heading">
                                 <b class="panel-title"><span class="xiahua">成绩榜</span></b>
                                <span style="float: right;">
                                	<a href="Ranking.html" target="_blank" style="color: #0AA788;">more  <i class="fa fa-arrow-circle-right"></i></a>
                                </span>
                            </div>
                            <div class="panel-body">
                                <div class="table" style="height: 380px;overflow: hidden;">
                                    <table id="achievement" class="display" width="100%" style="line-height: 34px;"></table>
                                </div>
                            </div>
                        </div>
                    </div>-->
                </div>
            </div>

            <!-- /.曲线图 -->
        </div>
        <!-- /.container-fluid -->

    </div>
    <!-- /#page-wrapper -->

</div>
<!-- /#wrapper -->

<!-- jQuery -->
<script src="js/jquery.js"></script>
<script src="layui_src/layui.js" charset="utf-8"></script>
<!-- tab table-->
<!--<script src="//cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>-->
<!--<script src="http://cdn.datatables.net/plug-ins/28e7751dbec/integration/bootstrap/3/dataTables.bootstrap.js"></script>-->
<script src="js/cdn/jquery.dataTables.min.js"></script>
<script src="js/cdn/dataTables.bootstrap.js"></script>
<script src="nuget/content/scripts/toastr.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<!-- Morris Charts JavaScript -->
<script src="js/plugins/morris/raphael.min.js"></script>
<!-- <script src="js/plugins/morris/morris.min.js"></script>
<script src="js/plugins/morris/morris-data.js"></script>-->
<script type="text/javascript" src="js/vue/vue.js"></script>
<script type="text/javascript" src="js/vue/vue-router.js"></script>
<!--百度地图-->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=1e0u2fDgqYhUdilCb10Lz7xHyTBf99hG"></script>
<!--<script type="text/javascript" src="http://api.map.baidu.com/getscript?v=2.0&ak=1e0u2fDgqYhUdilCb10Lz7xHyTBf99hG&services=&t=20170823191629"></script>-->

<!--<script src="http://cdn.bootcss.com/sockjs-client/1.1.1/sockjs.min.js"></script>-->
<!--<script src="http://cdn.bootcss.com/stomp.js/2.3.3/stomp.js"></script>-->
<script src="js/cdn/sockjs.min.js"></script>
<script src="js/cdn/stomp.js"></script>
<script>
    /* 调整右侧 */
    var ww = $(window).width();
    if(ww > 1200){
        $(".r-scroll").css("padding-right","25px");
        $(".r-scroll").css("width","110%");
    }else{
        $(".r-scroll").css("padding-right","15px");
        $(".r-scroll").css("width","106%");
    }
    /* 调整右侧 */

    var userName = localStorage.getItem("userName");
    $("#userName").text(userName);
    var vue = new Vue({
        el: '#page-wrapper',
        data: {
            map: null,
            faultSupport: {},
            faultSupports: [],
            markers: [],
            labelShow:false,
            stompClient: null
        },
        mounted: function () {
            var _self = this;
            //百度地图
            this.map = new BMap.Map("allmap");
            this.init();

            /**
             * 将查询到的数据缓存到 sessionStorage
             * socket推送的数据追加到缓存数据中
             * 将数据用来初始化
             *
             * socket接收广播，后台发送广播，不再一对一通讯
             * 数据一致性问题稍后考虑
             */
            /* ajax init start */
            //初始化查询 realTime
            var initRealTimeAjax = function () {
                $.ajax({
                    url : url +'/scenesResults',
                    type : 'get',
                    data:{
                        "currentPage":1,
                        "pageSize":12,
                        "count":12,
                    },
                    async: false,
                    dataType : 'json',
                    beforeSend: function(request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                    	console.log(data);
                        sessionStorage.setItem("realTimeObj", JSON.stringify(data));
                        _self.realTime(data);
                    }
                });
            };
            //初始化查询 Illegal
            var initIllegalAjax = function () {
                $.ajax({
                    url: url + '/illegalResults',//117
                    type: 'get',
                    data: {
                        "currentPage": 1,
                        "pageSize": 12,
                        "count": 12,
                        "teamId":teamId,
                    },
                    async: false,
                    dataType: 'json',
                    beforeSend: function (request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                        sessionStorage.setItem("illegalObj", JSON.stringify(data));
                        _self.Illegal(data);
                    }
                });
            };
            //初始化查询 achievement
            var initAchievementAjax = function () {
                $.ajax({
                    url : url +'/users/'+adminId+'/stadiumResults',//
                    type : 'get',
                    data:{
                        "currentPage":1,
                        "pageSize":15,
                    },
                    async: false,
                    dataType : 'json',
                    beforeSend: function(request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                        _self.achievement(data);
                    }
                });
            };
            //初始化查询 intervene
            var initInterveneAjax = function () {
                $.ajax({
                    url : url +'/manualInterventions',
                    type : 'get',
                    data:{
                        "currentPage":1,
                        "pageSize":12,
                        "count":12,
                    },
                    async: false,
                    dataType : 'json',
                    beforeSend: function(request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                        _self.intervene(data);
                    }
                });
            };
            //初始化查询 marks
            var initMarkAjax = function () {
                $.ajax({
                    url: url + '/user/' + adminId + '/team/locations',
                    type: 'GET',
                    async: false,
                    data: {
                        "teamState": '-1'
                    },
                    dataType: 'json',
                    contentType: "application/json; charset=utf-8",
                    beforeSend: function (request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                    	console.log(data);
                        _self.marks(data);
                    }
                });
            };

            // 定时查询实时跟踪数据
            /*setInterval(function () {
				initMarkAjax();
			},3000);*/
            //初始化
            initRealTimeAjax(); //实时成绩；
            initIllegalAjax(); //违规信息
            initMarkAjax(); //实时跟踪
            /* ajax init end */

            /* websocket stomp start */
            function connect() {
                var timer = 3 * 1000; // 统一定时
                var socket = new SockJS(url + '/hello');
                stompClient = Stomp.over(socket);
                stompClient.connect({}, function (frame) {
                    // realTime 实时成绩
                    stompClient.subscribe('/topic/testScenesResultsocketpush', function (result) {
                        var str = sessionStorage.getItem("realTimeObj");
                        var data = JSON.parse(str);
                        var obj = JSON.parse(result.body);
                        data.result.unshift(obj.result);

                        sessionStorage.setItem("realTimeObj", JSON.stringify(data));
                        _self.realTime(data);//处理返回数据
                    });
                    // illegal 违规信息
                    stompClient.subscribe('/topic/testIllegalResultsocketpush', function (result) {
                        var str = sessionStorage.getItem("illegalObj");
                        var data = JSON.parse(str);
                        var obj = JSON.parse(result.body);
                        data.result.unshift(obj.result);

                        sessionStorage.setItem("illegalObj", JSON.stringify(data));
                        _self.Illegal(data);//处理返回数据
                    });
                    stompClient.subscribe('/topic/testsocketpush', function (result) {
                        var str = sessionStorage.getItem("illegalObj");
                        var data = JSON.parse(str);
                        var obj = JSON.parse(result.body);
                        data.result.unshift(obj.result);
                        _self.Illegal(data);//处理返回数据
                    });
//                    // 接收 realTime 返回结果
//                    stompClient.subscribe('/user/' + adminId + '/scenes/results' , function (result) {
//                        _self.realTime(JSON.parse(result.body));//处理返回数据
//                        setTimeout(queryRealTime, timer);
//                    });
//                    // 接收 illegal 返回结果
//                    stompClient.subscribe('/user/' + adminId + '/illegal/results' , function (result) {
//                        _self.Illegal(JSON.parse(result.body));//处理返回数据
//                        setTimeout(queryIllegal, timer);
//                    });
//                    // 接收 achievement 返回结果
//                    stompClient.subscribe('/user/' + adminId + '/users/results' , function (result) {
//                        _self.achievement(JSON.parse(result.body));//处理返回数据
//                        setTimeout(queryAchievement, timer);
//                    });
//                    // 接收 queryIntervene 返回结果
//                    stompClient.subscribe('/user/' + adminId + '/manual/interventions' , function (result) {
//                        console.log("get in");
//                        _self.intervene(JSON.parse(result.body));//处理返回数据
//                        setTimeout(queryIntervene, timer);
//                    });
//                    // 接收 queryMarks 返回结果
//                    stompClient.subscribe('/user/' + adminId + '/userTeamLocations' , function (result) {
//                        _self.marks(JSON.parse(result.body));//处理返回数据
//                        setTimeout(queryMarks, timer);
//                    });
//                    //初始化查询
//                    queryRealTime();
//                    queryIllegal();
//                    queryAchievement();
//                    queryIntervene();
//                    queryMarks();
                });
            }
//            //查询 realTime
//            function queryRealTime() {
//                var param = {
//                    user: adminId,
//                    "currentPage":1,
//                    "pageSize":12,
//                    "count":12,
//                    "accessToken": accessToken
//                };
//                var src = "/app/scenesResultsSocket";
//                stompClient.send(src, param);
//            }
//            //查询 Illegal
//            function queryIllegal() {
//                var param = {
//                    user: adminId,
//                    "currentPage": 1,
//                    "pageSize": 12,
//                    "count": 12,
//                    "accessToken": accessToken
//                };
//                var src = "/app/illegalResultsSocket"; //illegalResults
//                stompClient.send(src, param);
//            }
//            //查询 achievement
//            function queryAchievement() {
//                var param = {
//                    user: adminId,
//                    "currentPage":1,
//                    "pageSize":15,
//                    "accessToken": accessToken
//                };
//                var src = "/app/users/stadiumResultsSocket";
//                stompClient.send(src, param);
//            }
//            //查询 intervene
//            function queryIntervene() {
//                var param = {
//                    user: adminId,
//                    "currentPage":1,
//                    "pageSize":12,
//                    "count":12,
//                    "accessToken": accessToken
//                };
//                var src = "/app/manualInterventionsSocket";
//                console.log("send in");
//                stompClient.send(src, param);
//            }
//            //查询 marks
//            function queryMarks() {
//                var param = {
//                    userId: adminId,
//                    "teamState": "-1",
//                    "accessToken": accessToken
//                };
//                var src = "/app/user/team/locations";
//                stompClient.send(src, param);
//            }
            connect();
            /* websocket stomp end */
//            this.drawMarks();
        },
        methods: {
            init: function () {
                this.map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
                this.map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
                this.map.centerAndZoom(new BMap.Point(120.7883557890, 31.5949345961), 17);
            },
            marks:function(data){

                var _self = this;
					if (data.code == 1) {
                        _self.faultSupports = data.result;
                        _self.markers = [];
                        if (_self.faultSupports.length == 0) {
                            _self.faultSupport={};
                            _self.labelShow=false;
                            _self.map.clearOverlays()
                        } else {
                        	_self.map.clearOverlays()
                            for (var i = 0; i < _self.faultSupports.length; i++) {

                                var point = new BMap.Point(_self.faultSupports[i].longitude, _self.faultSupports[i].latitude);

                                var team = _self.faultSupports[i].teamState;
                                if(team == 1){
                                	var myIcon = new BMap.Icon(("img/carred.png"), new BMap.Size(41,34))
                                }else if(team == 2){
                                	var myIcon = new BMap.Icon(("img/car_yellow.png"), new BMap.Size(41,34))
                                }else{
                                	var myIcon = new BMap.Icon(("img/car.png"), new BMap.Size(41,34))
                                }

                                var marker = new BMap.Marker(point,{icon:myIcon});// 创建标注
                                _self.map.addOverlay(marker);
                                if(team == 1){
                                	var label = new BMap.Label(_self.faultSupports[i].teamName+"  -故障中",{offset:new BMap.Size(20,-20)});
                                }else if(team == 2){
                                	var label = new BMap.Label(_self.faultSupports[i].teamName+"  -暂停中",{offset:new BMap.Size(20,-20)});
                                }else if(team == 3){
                                	var label = new BMap.Label(_self.faultSupports[i].teamName+"  -已结束",{offset:new BMap.Size(20,-20)});
                                }else{
                                	var label = new BMap.Label(_self.faultSupports[i].teamName+"  -比赛中",{offset:new BMap.Size(20,-20)});
                                }
								marker.setLabel(label);
                                _self.markers.push(marker);
                                (function(a){
                            		marker.addEventListener("click", function (e) {
                            			for(var j=0;j<_self.markers.length;j++){
                            				_self.markers[j].setAnimation(null);
                            			}
                                       // this.setAnimation(BMAP_ANIMATION_BOUNCE);
                                        _self.faultSupport = $.parseJSON(JSON.stringify(a));
					                    _self.faultSupport.faultSupportStateInfo = "未处理";
					                    _self.faultSupport.createTimeInfo = replaceTimeWithoutYear(_self.faultSupport.locationTime / 1000);
					                    _self.labelShow=true;
	                                });
                            	})(_self.faultSupports[i]);

                            }
                        }
                        
                	} else {
                        window.location.href="login.html";
                   }

            },
            show:function(){
            	 this.labelShow = !this.labelShow;
            },
            resolve: function (obj) {
                var _self = this;
                $.ajax({
                    url : url + '/users/'+adminId+'/teams/'+ obj.teamId +'/faultSupport',
                    type : 'GET',
                    async: false,
                    dataType : 'json',
                    contentType: "application/json; charset=utf-8",
                    beforeSend: function (request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
//                        console.log(data);
                        if(data.status === 'success'){
                            var faultSupportId = data.result.faultSupportId;

                            _self.putResolve(faultSupportId);
                        }else{
                            alert(data.description);
                        }
                    }
                });
            },
            putResolve: function (faultSupportId) {
                var _self = this;
                $.ajax({
                    url : url + '/users/'+adminId+'/faultSupports/'+ faultSupportId,
                    type : 'PUT',
                    async: false,
                    dataType : 'json',
                    contentType: "application/json; charset=utf-8",
                    beforeSend: function (request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
//                        console.log(data);
                        if(data.status === 'success'){
                            vue.marks();
                            _self.show();
                        }else{
                            alert(data.description);
                        }
                    }
                });
            },
            /*drawMarks: function () {
                var _self = this;
                $.ajax({
                    type: "get",
                    url: url + '/users/' + adminId + '/faultSupports',
                    async: false,
                    dataType: 'json',
                    data: {
                        faultSupportState: 0,
                    },
                    contentType: "application/json; charset=utf-8",
                    beforeSend: function (request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                    	if (data.code == 1) {
	                        _self.faultSupports = data.result;
	                        _self.markers = [];
	                        if (_self.faultSupports.length == 0) {
	                            _self.faultSupport={};
	                            _self.labelShow=false;
	                        } else {
	                            for (var i = 0; i < _self.faultSupports.length; i++) {
	                                var point = new BMap.Point(_self.faultSupports[i].longitude, _self.faultSupports[i].latitude);
	                                var marker = new BMap.Marker(point);// 创建标注
	                                _self.map.addOverlay(marker);
	                                _self.markers.push(marker);
	                                (function(a){
	                            		marker.addEventListener("click", function (e) {

	                            			for(var j=0;j<_self.markers.length;j++){
	                            				_self.markers[j].setAnimation(null);
	                            			}
	                                        this.setAnimation(BMAP_ANIMATION_BOUNCE);
	                                        _self.faultSupport = $.parseJSON(JSON.stringify(a));
						                    _self.faultSupport.faultSupportStateInfo = "未处理";
						                    _self.faultSupport.createTimeInfo = replaceTimeWithoutYear(_self.faultSupport.createTime / 1000);
						                    _self.labelShow=true;

		                                });
	                            	})(_self.faultSupports[i]);

	                            }
	                        }
	                        _self.map.centerAndZoom(new BMap.Point(120.285, 36.272513), 15);
                    	} else {
                            alert(data.description);
                       }
                    }
                });
            },*/
            /*changeState: function (faultSupportId) {
                var _self = this;
                $.ajax({
                    type: "put",
                    url: url + '/users/' + adminId + '/faultSupports/' + faultSupportId,
                    async: false,
                    dataType: 'json',
                    contentType: "application/json; charset=utf-8",
                    beforeSend: function (request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                        if (data.code == 1) {
                            _self.markers = [];
                            _self.faultSupports = [];
                            _self.map.clearOverlays();
                            _self.drawMarks();
                            _self.labelShow=false;
                        } else {
                            alert(data.description);
                        }
                    }
                });

            },*/
            intervene:function(result){
           		var myTable = $('#intervene').DataTable({
		            "processing": false, //DataTables载入数据时，是否显示‘进度’提示
		            "stateSave": true, //是否打开客户端状态记录功能,此功能在ajax刷新纪录的时候不会将个性化设定回复为初始化状态
		            "scrollCollapse": true, //是否开启DataTables的高度自适应，当数据条数不够分页数据条数的时候，插件高度是否随数据条数而改变
		            "paginationType": "full_numbers", //详细分页组，可以支持直接跳转到某页
		            "language": lang, //提示信息
		            "autoWidth": true, //自适应宽度，
		            "lengthMenu": [8, 30, 50],
		            "stripeClasses": ["odd", "even"], //为奇偶行加上样式，兼容不支持CSS伪类的场合
		            "showRowNumber":true,
		            "destroy":true,
		            "searching": false, //是否允许Datatables开启本地搜索
		            "paging": false, //是否开启本地分页
		            "lengthChange": false, //是否允许产品改变表格每页显示的记录数
		            "info": false, //控制是否显示表格左下角的信息
		            //跟数组下标一样，第一列从0开始，这里表格初始化时，第四列默认降序
		            "ordering": false,
		            "deferRender": true, //延迟渲染
                    "ajax": function (data, callback, settings) {
                        if(result['code'] == 1){
                            if(result.result.length != 0){
                                var returnData = {};
                                returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                                returnData.recordsTotal = result.numReturn;//返回数据全部记录
                                returnData.recordsFiltered = result.numReturn;//后台不实现过滤功能，每次查询均视作全部结果
                                returnData.data = result.result;//返回的数据列表
                                callback(returnData);
                            }else{
                                $('#intervene').dataTable().fnClearTable();
                            }
                        }else{
                            ifajax(result);
                        }
                    },
		            "columns": [{
		                "data": function(obj){
		                	var  time =  replaceDate(obj.startTime /1000);
			        		return '<a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a>';
		                },
		                "sTitle": "车队", //标题
		                "sDefaultContent": "", //此列默认值为""，以防数据中没有此值，DataTables加载数据的时候报错
		            },{
		                "data": function(obj) {
		                   if(obj.interveneType == 1){
		                   		return '人工代驾';
		                   }else{
		                   		return '人工干预';
		                   }
		                },
		                "sTitle": "得分情况", //标题
		                "sType": 'chinese',
		                "sDefaultContent": "", //此列默认值为""，以防数据中没有此值，DataTables加载数据的时候报错
		            },{
		                "data": function(obj) {
		                    return '-'+obj.deductScore+'分';
		                },
		                "sTitle": "得分情况", //标题
		                "sType": 'chinese',
		                "sDefaultContent": "", //此列默认值为""，以防数据中没有此值，DataTables加载数据的时候报错
		            },{
		                "data": function(obj) {
		                    return  obj.spendTime+'秒';
		                },
		                "sTitle": "实时时间", //标题
		                "sDefaultContent": "", //此列默认值为""，以防数据中没有此值，DataTables加载数据的时候报错
		            }]
		        });
            },
            realTime:function(result){
		        var myTable = $('#realTime').DataTable({
		            "processing": false, //DataTables载入数据时，是否显示‘进度’提示
		            "stateSave": true, //是否打开客户端状态记录功能,此功能在ajax刷新纪录的时候不会将个性化设定回复为初始化状态
		            "scrollCollapse": true, //是否开启DataTables的高度自适应，当数据条数不够分页数据条数的时候，插件高度是否随数据条数而改变
		            "paginationType": "full_numbers", //详细分页组，可以支持直接跳转到某页
		            "language": lang, //提示信息
		            "autoWidth": true, //自适应宽度，
		            "lengthMenu": [8, 30, 50],
		            "stripeClasses": ["odd", "even"], //为奇偶行加上样式，兼容不支持CSS伪类的场合
		            "showRowNumber":true,
		            "destroy":true,
		            "searching": false, //是否允许Datatables开启本地搜索
		            "paging": false, //是否开启本地分页
		            "lengthChange": false, //是否允许产品改变表格每页显示的记录数
		            "info": false, //控制是否显示表格左下角的信息 //跟数组下标一样，第一列从0开始，这里表格初始化时，第四列默认降序
		            "ordering": false,
		            "deferRender": true, //延迟渲染
//                    "serverSide": true,
                    "ajax": function (data, callback, settings) {
                        if(result['code'] == 1){
                        	console.log(result);
                            if(result.result.length != 0){
                                var returnData = {};
                                returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                                returnData.recordsTotal = result.numReturn;//返回数据全部记录
                                returnData.recordsFiltered = result.numReturn;//后台不实现过滤功能，每次查询均视作全部结果
                                returnData.data = result.result;//返回的数据列表
                                callback(returnData);
                            }else{
                                $('#realTime').dataTable().fnClearTable();
                            }
                        }else{
                            ifajax(result);
                        }
                    },
		            "columns": [
                        {
                            "sTitle": "实时成绩", //标题
                            "sDefaultContent": "",
                            "data": function(obj){
                                var createTime = replaceHourTime(obj.createTime / 1000);
                                var time = getYMD(obj.createTime / 1000);
                                if(obj.scenesType != 1){
                                    if(obj.scenesNo != null){
                                        return '<div style="font-size: 16px;">'+'<a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a>'+'<span style="float:right">'+'[场景'+obj.scenesNo+']'+obj.scenesName+'</span></br><span style="color:red">'+obj.scenesResult+'分</span><span style="float:right">'+createTime+'</span></div>';
                                    }else{
                                        return '<div style="font-size: 16px;">'+'<div style="font-size: 16px;">'+'<a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a>'+'<span style="float:right">'+'[场景]'+obj.scenesName+'</span></br><span style="color:red">'+obj.scenesResult+'分</span><span style="float:right">'+createTime+'</span></div>';
                                    }

                                }else{
                                    return '<div style="font-size: 16px;">'+'<div style="font-size: 16px;">'+'<a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a>'+'<span style="float:right">'+'[路段]'+obj.scenesName+'</span></br><span style="color:red">-'+obj.scenesResult+'分</span><span style="float:right">'+createTime+'</span></div>';

                                }
                            }
                        }
		            ]
		        });
            },
            Illegal:function(result){
            	var myTable = $('#Illegal').DataTable({
		            "processing": false, //DataTables载入数据时，是否显示‘进度’提示
		            "stateSave": true, //是否打开客户端状态记录功能,此功能在ajax刷新纪录的时候不会将个性化设定回复为初始化状态
		            "scrollCollapse": true, //是否开启DataTables的高度自适应，当数据条数不够分页数据条数的时候，插件高度是否随数据条数而改变
		            "paginationType": "full_numbers", //详细分页组，可以支持直接跳转到某页
		            "language": lang, //提示信息
		            "autoWidth": true, //自适应宽度，
		            "lengthMenu": [8, 30, 50],
		            "stripeClasses": ["odd", "even"], //为奇偶行加上样式，兼容不支持CSS伪类的场合
		            "showRowNumber": true,
		             "destroy":true,
		            "searching": false, //是否允许Datatables开启本地搜索
		            "paging": false, //是否开启本地分页
		            "lengthChange": false, //是否允许产品改变表格每页显示的记录数
		            "info": false, //控制是否显示表格左下角的信息 //跟数组下标一样，第一列从0开始，这里表格初始化时，第四列默认降序
		            "ordering": false,
		            "deferRender": true, //延迟渲染
                    "ajax": function (data, callback, settings) {
                        if(result['code'] == 1){
                        	console.log(result);
                            if(result.result.length != 0){
                                var returnData = {};
                                returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                                returnData.recordsTotal = result.numReturn;//返回数据全部记录
                                returnData.recordsFiltered = result.numReturn;//后台不实现过滤功能，每次查询均视作全部结果
                                returnData.data = result.result;//返回的数据列表
                                callback(returnData);
                            }else{
                                $('#Illegal').dataTable().fnClearTable();
                            }
                        }else{
                            ifajax(result);
                        }
                    },
		            "columns": [
                        {
                            "sTitle": "违规信息",
		                    "sDefaultContent": "",
                            "data": function(obj){
                                var createTime = replaceHourTime(obj.createTime / 1000);
                                var time = getYMD(obj.createTime / 1000);
                                if(obj.scenesType != 1){
                                    if(obj.scenesNo != null){
                                        return '<div style="font-size: 16px;"><a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a><span style="float:right">[场景'+obj.scenesNo+']'+obj.illegalName+'</span></br><span style="color:red">- '+obj.deductScore+'分</span><span style="float:right">'+createTime+'</span></div>';
                                    }else{
                                        return '<div style="font-size: 16px;"><a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a><span style="float:right">[场景]'+obj.illegalName+'</span></br><span style="color:red">- '+obj.deductScore+'分</span><span style="float:right">'+createTime+'</span></div>';
                                    }

                                }else{
                                    return '<div style="font-size: 16px;"><a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a><span style="float:right">[路段]'+obj.illegalName+'</span></br><span style="color:red">- '+obj.deductScore+'分</span><span style="float:right">'+createTime+'</span></div>';
                                }
                            }
                        }
		            ]
		        });
            },
            achievement:function(result){
            	var myTable = $('#achievement').DataTable({
			     "processing": false, //DataTables载入数据时，是否显示‘进度’提示
				  "stateSave": true, //是否打开客户端状态记录功能,此功能在ajax刷新纪录的时候不会将个性化设定回复为初始化状态
				  "scrollCollapse": true, //是否开启DataTables的高度自适应，当数据条数不够分页数据条数的时候，插件高度是否随数据条数而改变
				  "paginationType": "full_numbers", //详细分页组，可以支持直接跳转到某页
				  "language": lang, //提示信息
				  "destroy":true,//Cannot reinitialise DataTable,解决重新加载表格内容问题
				  "autoWidth": true, //自适应宽度，
				  "lengthMenu": [8, 30, 50],
				  "stripeClasses": ["odd", "even"], //为奇偶行加上样式，兼容不支持CSS伪类的场合
				  "showRowNumber":true,
				   "destroy":true,
				  "searching": false, //是否允许Datatables开启本地搜索
				  "paging": false, //是否开启本地分页
				  "lengthChange": false, //是否允许产品改变表格每页显示的记录数
				  "info": false, //控制是否显示表格左下角的信息
			     "ordering": false,
			      "deferRender": true, //延迟渲染
                    "ajax": function (data, callback, settings) {
                        if(result['code'] == 1){
                            if(result.result.length != 0){
                                var returnData = {};
                                returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                                returnData.recordsTotal = result.numReturn;//返回数据全部记录
                                returnData.recordsFiltered = result.numReturn;//后台不实现过滤功能，每次查询均视作全部结果
                                returnData.data = result.result;//返回的数据列表
                                callback(returnData);
                            }else{
                                $('#achievement').dataTable().fnClearTable();
                            }
                        }else{
                            ifajax(result);
                        }
                    },
//			      "ajax": {
//			      	url : url +'/users/'+adminId+'/stadiumResults',//
//							type : 'get',
//							data:{
//								"currentPage":1,
//								"pageSize":15,
//							},
//							async: false,
//							dataType : 'json',
//							beforeSend: function(request) {
//					            request.setRequestHeader("accessToken", accessToken);
//					        },
//							success : function(data) {
//
//								if(data['code'] == 1){
//									if(data.result.length != 0)
//										$('#achievement').dataTable().fnAddData(data.result);
//									else
//										$('#achievement').dataTable().fnClearTable();
//								}else{
//									ifajax(data);
//								}
//							}
//					  }, //数据的路径 "http://192.168.5.133:8081/ic-iot/admin/'+adminId+'/devices" /"json/device.json"

			      "columns": [{ //定义列
			        "data":"riwso",
			        "render":function(data, type, full, meta ){
			        	return (meta.row+1);
			        },
			        "sTitle": "排名", //标题
			        "width":"30px",
			        "sDefaultContent": "", //此列默认值为""，以防数据中没有此值，DataTables加载数据的时候报错
			      },{
			        "data":function(obj){
		                	var  time =  replaceDate(obj.endTime /1000);
			        		return '<a href="Exhibition.html?teamId=' + obj.teamId + '&date='+time+'" target="_blank" style="color:#1aa79d; text-decoration:none;"><b>' + obj.teamName + '</b></a>';
		                },
			        "sTitle": "车队", //标题
			        "sDefaultContent": "", //此列默认值为""，以防数据中没有此值，DataTables加载数据的时候报错
			      }, {
			      	"data":"teamOrganization",
			      	"sTitle":"单位",
			      	"sDefaultContent": "",
			      },{
			        "data": function(obj) {
			            return obj.totalScore;
			        },
			        "sTitle": "成绩", //标题
			        "sType": 'chinese',
			         "width":"30px",
			        "sDefaultContent": "", //此列默认值为""，以防数据中没有此值，DataTables加载数据的时候报错
			      }]
			    });
            }

        }
    });


</script>

</body>

</html>
